<template>
  <div></div>
</template>

<script>
export default {
  data() {
    return {};
  },
  created() {
    this.trylocal();
  },
  methods: {
    trylocal() {
      // 设置缓存信息
      let oneInfo = { name="one", age="12", like="sleep" };
      let twoInfo = { name="two", age="13", like="relax" };
      let threeInfo = { name="three", age="14", like="holiday" };
      let fourInfo = { name="four", age="15", like="rest" };

      // 将需要存储的信息转换为字符串类型
      oneInfo = JSON.parse(oneInfo);
      twoInfo = JSON.parse(twoInfo);
      threeInfo = JSON.parse(threeInfo);
      fourInfo = JSON.parse(fourInfo);

      // 将信息存入缓存
      localStorage.setItem("INFO1", oneInfo);
      localStorage.setItem("INFO2", twoInfo);
      localStorage.setItem("INFO3", threeInfo);
      localStorage.setItem("INFO4", fourInfo);

      // 通过key在缓存中获取信息
      let get = localStorage.getItem('INFO3');
      console.log(get);

      // 获取缓存key中的数量
      let len = localStorage.length;
      console.log(len);

      // 获取任意位置的key
      let key = localStorage.key(3);
      console.log(key);

      // 查询是否存在key
      let has = localStorage.hasOwnProperty('name')
      console.log(has);

      // 根据key值删除该条信息
      localStorage.removeItem('INFO2')
      
      // 清除所有缓存信息
      localStorage.clear()
    }
  },
};
</script>

<style lang="scss" scoped>
</style>
